<template>
  <div>
    <a-drawer :title="$t('user.verification-code.required111566191')" :width="600" :visible.sync="visible"
      :body-style="{ 'padding-top': '0px', paddingBottom: '80px' }" @close="close">
      <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }" layout="horizontal">
        <a-form-item :label="$t('u116')">
          
          <a-input v-decorator="[
            'YtAdminUserName',
            { rules: [{ required: true, message: $t('u116-1') }] },
          ]" :placeholder="$t('u116-1')" />
        </a-form-item>
        <a-form-item :label="$t('u117')">
          
          <a-input v-decorator="[
            'YtAdminDepartment',
            { rules: [{ required: true, message: $t('u117-1') }] },
          ]" :placeholder="$t('u117-1')" />
        </a-form-item>
        <a-form-item :label="$t('u118')">
          
          <a-input v-decorator="[
            'YtAdminEmail',
            { rules: [{ required: true, message: $t('u118-1') }] },
          ]" :placeholder="$t('u118-1')" />
        </a-form-item>
        <a-form-item :label="$t('u119')">
          
          <a-input v-decorator="[
            'YtAdminPassWord',
            { rules: [{ required: true, message: $t('u119-1') }] },
          ]" :placeholder="$t('u119-1')" />
        </a-form-item>
      </a-form>
      <div
      class="absolute right-0 bottom-0 w-full border-t border-[#e9e9e9] px-4 py-[10px] bg-white text-left z-1 flex justify-center">
      <a-button :style="{ marginRight: '20px' }" class="w-[200px]" @click="close">{{ $t('user.email.required11')
      }}</a-button>
      <a-button class="w-[200px]" type="primary" @click.native.prevent="submit()">
        {{ $t('app.setting.weakmode') }}
      </a-button>
    </div>
    </a-drawer>
  </div>
</template>

<script>
import { createUser } from '@/api';
export default {
  data() {
    return {
      form: this.$form.createForm(this),
      visible: false,
    }
  },
  methods: {
    open() {
      this.visible = true
    },
    submit() {
      const {
        form: { validateFields },
      } = this;
      this.loading = true;
      validateFields(
        ["YtAdminUserName", "YtAdminDepartment", 'YtAdminEmail','YtAdminPassWord'],
        { force: true },
        async (err, values) => {
          if (!err) {
            try {
              console.log(values);
                await createUser({
                  YtAdminUserName: values.YtAdminUserName,
                  YtAdminDepartment: values.YtAdminDepartment,
                  YtAdminEmail: values.YtAdminEmail,
                  YtAdminPassWord:values.YtAdminPassWord
                })
              this.$emit("succeed");
              this.$message.success(this.$t('user.verification-code.required111566110577308'))
              this.close();
            } catch (error) {
              this.$message.error(error);
              console.log(error);
            } finally {
              this.loading = false;
            }
          } else {
            setTimeout(() => {
              this.loading = false;
            }, 600);
          }
        }
      );
    },
    close() {
      this.visible = false
      this.form.resetFields()
    },
  }
}
</script>

<style></style>